<template>
  <div class="container">
    <Rotation />

    <h2>热销商品</h2>
    <Item ref="item" :renderData="this.$store.state.products.slice(0, 60)" />
    <Bottom />
  </div>
</template>

<script>
import Rotation from "./rotation/rotation.vue";
import Item from "@/components/product/item";
import Bottom from "@/components/bottom";
export default {
  components: {
    Rotation,
    Item,
    Bottom,
  },
};
</script>

<style lang="scss" scoped>
.container {
  width: calc(100vw - 270px); // 减nav的宽度
  margin: 60px 0 0 0px;
  height: calc(100vh - 60px);
  position: relative;
  padding: 0px 0px 0px 0px;
  overflow-y: scroll;
  font-family: DianHei-5;
  h2 {
    letter-spacing: 0.2rem;
    margin: 50px 0;
  }
}
</style>